<template>
  <div class="container">
    <!-- 顶部标题 -->
    <el-row class="topContent boxBorder">
      <!-- <el-col :span="16" class="salaryTitle"> -->
      <el-col :span="16" class="salaryTitle">
        <div>
          <div class="contentTop">
            <p>
              <span class="topProjectName" id="topProjectName">
                <i class="icon iconfont iconfanhui1" @click="goBack"></i>
                {{ detailProjectName || '--' }}
                <span
                  class="startStatus noStart"
                  v-show="detailStatus == 'NOT_STARTED'"
                  >未开工</span
                >
                <span class="startStatus" v-show="detailStatus == 'STARTED'"
                  >已开工</span
                >
                <span
                  class="startStatus startStop"
                  v-show="detailStatus == 'STOPPED'"
                  >已停工</span
                >
                <span
                  class="startStatus startOver"
                  v-show="detailStatus == 'COMPLETED'"
                  >已竣工</span
                >
                <span
                  class="startStatus startFinished"
                  v-show="detailStatus == 'FINISHED'"
                  >已完工</span
                >
                <!-- 是否小项目 -->
                <span class="startStatus miniStart" v-if="isMini == 1"
                  >小项目</span
                >
                <el-link
                  type="primary"
                  v-if="isMini == 1"
                  style="transform: translateY(-2px)"
                  @click="lookRule"
                  >小项目管理规则</el-link
                >
              </span>
            </p>
            <p class="startTime">
              于
              <span>{{ detailCreateTime }}</span>
              建档，于
              <span>{{ detailStartDate || '--' }}</span
              >开工，建设周期 <span>{{ detailCycle || '--' }}</span
              >天
              <span v-show="detailDisDate >= 0">，距离计划竣工还剩</span>
              <span v-show="detailDisDate < 0">，超出计划竣工</span>
              <span>{{ Math.abs(detailDisDate) || '--' }}</span>
              <span>天</span>
            </p>
            <el-row class="billboard">
              <span style="padding-right: 40px"
                >项目来源：{{ detailSourceType || '--' }}</span
              >
              <span style="padding-right: 40px"
                >维权公示牌：
                <span v-show="detailIsPs === '未上传'">未上传</span>
                <span class="isUpload" v-show="detailIsPs === '已上传'"
                  >已上传</span
                >
                <span class="previewBox" v-show="detailIsPs === '已上传'">
                  <el-link type="primary" :underline="false">点击预览</el-link>
                  <el-image
                    class="previewImg"
                    style="width: 56px; height: 16px"
                    :src="imgUrl"
                    :preview-src-list="srcList"
                  ></el-image>
                </span>
              </span>
              <span v-if="isWhUser()"
                >项目现场情况：
                <span v-show="liveSituation === '未上传'">未上传</span>
                <span class="isUpload" v-show="liveSituation === '已上传'"
                  >已上传</span
                >
                <span class="previewBox" v-show="liveSituation === '已上传'">
                  <el-link type="primary" :underline="false">点击预览</el-link>
                  <el-image
                    class="previewImg"
                    style="width: 56px; height: 16px"
                    :src="xcImgUrl"
                    :preview-src-list="xcSrcList"
                  ></el-image>
                </span>
              </span>
            </el-row>
          </div>
        </div>
        <!-- <el-col :span="8" class="alignRight">
                    <div class="generateQRcode" id="generateQRcode">
                        <img :src="qrcodeImgUrl" alt="">
                        <p>使用和谐用工app 扫一扫</p>
                    </div>
                </el-col> -->
      </el-col>
      <el-col :span="8" class="alignRight">
        <!-- 企业端并且是建设方才有 -->
        <!-- 已开工状态，对应显示“项目历史状态变更动态、设置停工、设置竣工”按钮
                已停工状态，对应显示“项目历史状态变更动态、恢复开工”按钮
                已竣工状态，对应显示“项目历史状态变更动态”按钮
                未开工状态，不显示上述按钮 -->
        <div v-if="isShowBut">
          <!-- v-if="isJS && isShowUpdate" -->
          <el-button
            type="danger"
            @click="openDialog('STOPPED')"
            v-show="detailStatus == 'STARTED'"
            >设置停工</el-button
          >
          <el-button
            class="greenBack saveBtn"
            @click="openDialog('COMPLETED')"
            v-show="detailStatus == 'STARTED'"
            >设置竣工</el-button
          >
          <el-button
            class="greenBack saveBtn"
            @click="openDialog('STARTED')"
            v-show="detailStatus == 'STOPPED'"
            >设置开工</el-button
          >
        </div>
        <!-- <div v-if ="(stateUserType =='DIRECTOR' || stateUserType == 'AREAMANAGE' ||stateUserType == 'MONITOR' || stateUserType == 'CHIEF') &&　(isXiangYangUser() || isWhUser() || isCzUser())"> -->
        <div v-if="isShowStatuChange">
          <el-button class="greenBack saveBtn" @click="statusChange"
            >项目状态变更</el-button
          >
        </div>
        <!-- 未开工显示项目历史变更 -->
        <div class="historyChange">
          <el-link type="primary" v-if="isShowDetail" @click="toHistoryChange"
            >项目历史状态变更</el-link
          >
        </div>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <el-tabs
          v-model="activeName"
          type="card"
          @tab-click="handleClick"
          class="commonTab"
        >
          <el-tab-pane label="项目看板" name="first">
            <div class="containerbox" v-if="isShowFirst">
              <!-- 左边 -->
              <projectDetailKbLeft
                :projectId="projectId"
                :detailsalaryDay="detailsalaryDay"
              ></projectDetailKbLeft>
              <!-- 右边 -->
              <projectDetailKb
                @func="getmsg(arguments)"
                :projectId="projectId"
                :companyType="companyType"
              ></projectDetailKb>
              <!-- 详情弹框 -->
              <projectDetailPage
                v-if="projectDetailShow"
                @closeDia="getCloseDia"
                :projectId="projectId"
              ></projectDetailPage>
            </div>
          </el-tab-pane>
          <el-tab-pane label="花名册" name="second" class="noPaddingTop">
            <projectEmployeeList
              :showHistory="true"
              v-if="isShowSecond && (isMini !== 1 || miniRule.isRegister !== 0)"
              :projectId="projectId"
              :fromType="fromType"
              backPath="/home/monitorProjectManagement/projectDetail"
              :oldUrl="
                userType === 'QY'
                  ? '/home/project/projectListQY'
                  : '/home/project/projectList'
              "
            ></projectEmployeeList>
            <attach-record
              :showHistory="true"
              v-if="isShowSecond && isMini === 1 && miniRule.isRegister === 0"
              :projectId="projectId"
              :fromType="fromType"
              backPath="/home/monitorProjectManagement/projectDetail"
              :oldUrl="
                userType === 'QY'
                  ? '/home/project/projectListQY'
                  : '/home/project/projectList'
              "
            ></attach-record>
          </el-tab-pane>
          <el-tab-pane
            label="班组管理"
            name="group"
            v-if="isInsuranceHidden"
            class="noPaddingTop"
          >
            <projectGroupList
              v-if="showGroupManage"
              :jcProjectId="projectId"
              :detailProjectName="detailProjectName"
            ></projectGroupList>
          </el-tab-pane>
          <el-tab-pane label="参建单位" name="company" v-if="isInsuranceHidden">
            <!-- <participationUnits v-if="showCompany" :projectId="projectId" :jcDetail = "jcDetail"></participationUnits> -->
            <participationUnits
              v-if="showCompany"
              :projectId="projectId"
              :isJS="isJS"
              :projectName="detailProjectName"
              :fromType="fromType"
            ></participationUnits>
          </el-tab-pane>
          <el-tab-pane label="工人考勤" name="third">
            <jcConstructAttendanceContainer
              :showHistory="true"
              v-if="isShowThird && (isMini !== 1 || miniRule.isAtt !== 0)"
              :projectId="projectId"
            ></jcConstructAttendanceContainer>
            <attendance-attach-record
              :showHistory="true"
              :projectId="projectId"
              v-if="isShowThird && isMini === 1 && miniRule.isAtt === 0"
              backPath="/home/monitorProjectManagement/projectDetail"
              :oldUrl="
                userType === 'QY'
                  ? '/home/project/projectListQY'
                  : '/home/project/projectList'
              "
            ></attendance-attach-record>
          </el-tab-pane>
          <el-tab-pane label="工资发放" name="fourth" v-if="isInsuranceHidden">
            <salaryPayBatchList
              style="padding: 0"
              v-if="isShowFourth && (isMini !== 1 || miniRule.isSalary !== 0)"
              :showHistory="true"
              :projectId="projectId"
              :message="message"
              :isProjectDetail="true"
              :detailProjectName="detailProjectName"
            ></salaryPayBatchList>
            <salary-attach-record
              v-if="isShowFourth && isMini === 1 && miniRule.isSalary === 0"
              :showHistory="true"
              :projectId="projectId"
              backPath="/home/monitorProjectManagement/projectDetail"
              :oldUrl="
                userType === 'QY'
                  ? '/home/project/projectListQY'
                  : '/home/project/projectList'
              "
            ></salary-attach-record>
          </el-tab-pane>
          <el-tab-pane label="工资专户" name="fifth" v-if="isInsuranceHidden">
            <salarySpecialAccount
              v-if="isShowFifth"
              :projectId="projectId"
            ></salarySpecialAccount>
          </el-tab-pane>
          <el-tab-pane label="拨付计划" name="Appropriation">
            <allocationPlanDetail
              v-if="isShowAppropriation && disbursePlanId"
              :disbursePlanId="disbursePlanId"
              type="detail"
            ></allocationPlanDetail>
            <div v-else class="allocationPlanBox">
              <div class="noPaymeny">
                <img src="../../../static/img/noDataInfo.png" alt="" />
                <p>{{ allocationMsg }}</p>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="项目八大员" name="sixth" v-if="isInsuranceHidden">
            <eightEmployee
              v-if="isShowSixth"
              :projectId="projectId"
            ></eightEmployee>
          </el-tab-pane>
          <el-tab-pane label="工程款支付担保" name="projectPayment">
            <project-payment />
          </el-tab-pane>
        </el-tabs>
      </el-col>
    </el-row>
    <!-- 设置状态弹框 -->
    <el-dialog
      :title="
        butOperateState === 'STOPPED'
          ? '设置停工'
          : butOperateState === 'COMPLETED'
          ? '设置竣工'
          : '恢复开工'
      "
      :visible.sync="formStateVisible"
      width="640px"
      :before-close="cancelEdit"
      :modal-append-to-body="false"
    >
      <el-form
        :model="formDataOver"
        label-width="135px"
        :rules="formRulesOver"
        ref="formDataOver"
      >
        <el-form-item
          :label="
            butOperateState === 'STOPPED'
              ? '停工开始日期：'
              : butOperateState === 'COMPLETED'
              ? '实际竣工日期：'
              : '复工日期：'
          "
          prop="operateDate"
        >
          <el-date-picker
            type="date"
            :placeholder="
              butOperateState === 'STOPPED'
                ? '请选择停工的开始日期'
                : butOperateState === 'COMPLETED'
                ? '请选择实际竣工日期'
                : '请选择开工开始的日期'
            "
            v-model="formDataOver.operateDate"
            value-format="yyyy-MM-dd"
            @blur="toDisabled"
          ></el-date-picker>
        </el-form-item>
        <el-form-item
          :label="
            butOperateState === 'STOPPED'
              ? '停工原因：'
              : butOperateState === 'COMPLETED'
              ? '竣工原因：'
              : '复工原因：'
          "
          prop="operateReason"
        >
          <el-input
            type="textarea"
            v-model="formDataOver.operateReason"
            autocomplete="off"
            :placeholder="
              butOperateState === 'STOPPED'
                ? '请输入停工原因'
                : butOperateState === 'COMPLETED'
                ? '请输入竣工原因'
                : '请输入复工原因'
            "
            show-word-limit
            @blur="toDisabled"
            rows="3"
            class="mWidth"
          ></el-input>
        </el-form-item>
        <el-form-item
          :label="
            butOperateState === 'STOPPED'
              ? '上传停工凭证：'
              : butOperateState === 'COMPLETED'
              ? '上传竣工凭证：'
              : '上传复工凭证：'
          "
        >
          <uploadAnnex
            @getFileList="getFileList"
            :limitationFactor="limitationFactor"
            @getFile="getFile"
            :upLoadFile="formDataOver.upLoadFile"
          />
        </el-form-item>
        <el-row>
          <el-col :span="24">
            <!-- <elementImage :upLoadFile="formDataOver.upLoadFile"   :srcList="formDataOver.srcList" :oldSrcList="formDataOver.oldSrcList" @changeSrcList="changeSrcList"></elementImage> -->
            <uploadResult
              style="margin-left: 135px !important"
              :resultList="formDataOver.upLoadFile"
              @callBackResult="getFile"
            />
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="cancelEdit" class="cancel">取消</el-button>
        <!-- <el-button
                type="primary"
                @click.native="updateProjectState('COMPLETED','formDataOver')"
                class="save"
                >保存</el-button> -->
        <el-button v-show="disabled" disabled class="cancel">保存</el-button>
        <el-button
          v-show="!disabled"
          type="primary"
          @click.native="updateProjectState(butOperateState, 'formDataOver')"
          class="save"
          :loading="saveLoading"
          >保存</el-button
        >
      </div>
    </el-dialog>
    <!-- 项目历时状态变更弹框 -->
    <projectHistoryChange
      v-if="historyChangeDia"
      @closeDialog="hiddenDialog"
      :projectId="projectId"
    ></projectHistoryChange>
    <!-- 项目状态变更 -->
    <project-status
      v-if="projectStatusDia"
      @closeStatusDialog="statusHiddenDialog"
      :projectId="projectId"
      :detailStatus="detailStatus"
      @successFunc="successFunc"
    ></project-status>
    <!-- 小项目管理规则弹窗 -->
    <rule-dialog
      :projectInfo="miniRule"
      :showTaskProp="showRuleDialog"
      @handleClose="showRuleDialog = false"
    />
  </div>
</template>
<script>
import projectDetailKbLeft from '@/components/publicCom/projectDetailKbLeft'
import projectDetailKb from '@/components/monitorProjectManagement/projectDetailKb'
import projectDetailPage from '@/components/monitorProjectManagement/projectDetailPage'
import jcConstructAttendanceContainer from '@/components/constructAttendance/jcConstructAttendanceContainer'
import monitorAttendance from '@/components/constructAttendance/monitorAttendance'
import salarySpecialAccount from '@/components/specialAccount/salarySpecialAccount'
import projectEmployeeList from '@/components/employee/projectEmployeeList'
import salaryPayBatchList from '@/components/salaryDf/salaryPayBatchList'
import participationUnits from '@/components/employee/participationUnits'
import projectGroupList from '@/components/employee/constructGroup'
import eightEmployee from '@/components/employee/eightEmployee'
import common from '../../kits/common'
import ProjectPayment from './projectPayment.vue'
import projectHistoryChange from '@/components/publicCom/projectHistoryChange'
import projectStatus from '@/components/monitorProjectManagement/projectStatus'
import allocationPlanDetail from '@/components/separateAccountManagement/allocationPlanDetail'
import attachRecord from '@/components/smallProjectManage/attachRecord'
import attendanceAttachRecord from '@/components/smallProjectManage/attendanceAttachRecord'
import salaryAttachRecord from '@/components/smallProjectManage/salaryAttachRecord'

import ruleDialog from '@/components/smallProjectManage/ruleDialog'
export default {
  name: 'projectDetail',
  components: {
    projectDetailKbLeft,
    projectDetailKb,
    projectDetailPage,
    jcConstructAttendanceContainer,
    monitorAttendance,
    salarySpecialAccount,
    projectEmployeeList,
    salaryPayBatchList,
    participationUnits,
    projectGroupList,
    eightEmployee,
    ProjectPayment,
    projectHistoryChange,
    projectStatus,
    allocationPlanDetail,
    attachRecord,
    attendanceAttachRecord,
    salaryAttachRecord,
    ruleDialog,
  },
  props: ['docProjectId', 'type', 'id'],
  data() {
    var checkOperateDate = (rule, value, callback) => {
      if (!value) {
        if (this.butOperateState === 'STOPPED') {
          return callback(new Error('请选择停工的开始日期'))
        } else if (this.butOperateState === 'COMPLETED') {
          return callback(new Error('请选择实际竣工日期'))
        } else {
          return callback(new Error('请选择开工开始的日期'))
        }
      } else {
        callback()
      }
    }
    var checkOperateReason = (rule, value, callback) => {
      if (!value) {
        if (this.butOperateState === 'STOPPED') {
          return callback(new Error('请输入停工原因'))
        } else if (this.butOperateState === 'COMPLETED') {
          return callback(new Error('请输入竣工原因'))
        } else {
          return callback(new Error('请输入复工原因'))
        }
      } else {
        callback()
      }
    }
    return {
      isMini: 0,
      miniRule: {},
      miniMsg: '',
      isSamllProject: false,
      showRuleDialog: false,
      activeName: 'first',
      detailProjectName: '', //项目名称
      detailCreateTime: '', //建档日期
      detailStartDate: '', //开工日期
      detailCycle: '', //建设周期
      detailDisDate: '', //竣工时间
      detailStatus: '', //开工状态
      detailsalaryDay: '', //工资发放日
      detailSourceType: '', //项目来源
      detailIsPs: '', //公示牌是否上传
      imgUrl: '', //公示牌图片
      srcList: [],
      // qrcodeImgUrl: "", //右侧二维码
      message: 'salary', //工资详情tab 传值
      projectId: '',
      isShowFirst: true,
      isShowSecond: false,
      isShowThird: false,
      isShowFourth: false,
      isShowFifth: false,
      isShowSixth: false,
      isShowAppropriation: false,
      // typeData:"",
      showGroupManage: false,
      showCompany: false,
      jcDetail: '',
      projectDetailShow: false, //详情弹框是否显示
      userType: '', //用户类型
      companyType: '', //企业类型 JG建设方 SG施工方
      isInsuranceHidden: true, //工伤保险行政部门角色, 项目看板只提供看板、花名册、考勤功能，其他功能不提供
      fromType: 'projectDetail',
      formStateVisible: false, //设置弹框
      formDataOver: {
        operateDate: '',
        operateReason: '',
        upLoadFile: [], //附件
        srcList: [],
        oldSrcList: [],
      },
      formRulesOver: {
        operateDate: [
          {
            required: true,
            // message: "日期不能为空",
            validator: checkOperateDate,
            trigger: ['blur', 'change'],
          },
        ],
        operateReason: [
          {
            required: true,
            // message: "请输入竣工原因",
            validator: checkOperateReason,
            trigger: 'blur',
          },
        ],
      },
      limitationFactor: {
        uploadAnnexUrl: 'api-f/files/upload', //自定义上传文件接口地址
        upLoadFileLength: 5, //自定义上传文件最大数量设置
        fileSize: 5, //自定义上传文件最大设置
        messagetip: '仅支持上传png、jpg、jpeg格式文件', //自定义报错提示语
        formatType: 'typeOne', //自定义上传格式校验类型
        fileId: 'salaryExcel', //自定义id解决一个页面包含多个上传附件
        uploadFormId: 'salaryExcelForm', //自定义id解决一个页面包含多个上传附件
        methodTip: '最多上传5张图片，要求图片格式为jpg、png，最大不超过5M', //自定义上传文件提示
        uploadBtnType: 'typeOne', //自定义上传按钮类型
        messageFileSizetip: '最多能上传5M以内的图片',
      },
      butOperateState: '',
      historyChangeDia: false, //项目历时状态弹框
      isJS: false,
      disabled: true, //弹框有必填项未填就禁用
      isShowUpdate: false,
      isShowDetail: false,
      saveLoading: false,
      liveSituation: '', //现场情况是否上传
      xcImgUrl: '',
      xcSrcList: [],
      stateUserType: '',
      projectStatusDia: false, //项目状态变更
      statusDesc: '',
      disbursePlanId: '',
      allocationMsg: '',
      isShowStatuChange: false,
      isShowBut: false,
    }
  },
  created() {
    if (localStorage.getItem('judgeRoleCode') === 'owner') {
      this.isJS = true
    } else {
      this.isJS = false
    }
    this.stateUserType = this.$store.state.userType
    this.userType = localStorage.getItem('loginType')
    this.companyType = this.$route.query.companyType || ''
    this.isMini = this.$route.query.isMini
    // if(this.isMini){

    // }

    if (this.userType == 'JC') {
      if (this.$route.query.mark == 'label') {
        this.setActiveMenu('/home/labelManagement/labelManagementList')
      } else {
        this.setActiveMenu('/home/project/projectList')
      }
    } else if (this.userType === 'QY' || this.userType === 'XM') {
      this.setActiveMenu('/home/project/projectListQY')
    }
    // this.projectId = this.docProjectId;
    this.projectId = this.$route.query.projectId
    // this.typeData = this.type ? this.type : this.$route.query.type;
    this.activeName = this.$route.query.activeName
      ? this.$route.query.activeName
      : 'first'
    //从不同页面返回到项目看板的不同tab
    if (this.$route.query.activeName === 'second') {
      this.isShowSecond = true
    } else if (this.$route.query.activeName === 'third') {
      this.isShowThird = true
    } else if (this.$route.query.activeName === 'fourth') {
      this.isShowFourth = true
    } else if (this.$route.query.activeName === 'fifth') {
      this.isShowFifth = true
    } else if (this.$route.query.activeName === 'sixth') {
      this.isShowSixth = true
    } else if (this.$route.query.activeName === 'Appropriation') {
      this.isShowAppropriation = true
    } else {
      this.isShowFirst = true
    }
    // this.qrcodeImgUrl =
    //     common.commonApi +
    //     "api-p/project/base/qrimage?info=" +
    //     this.projectId;
    // 公示牌接口
    this.getPublicSign()

    this.getMiniRule(this.$route.query.projectId)
    if (this.activeName == 'first') {
      this.$nextTick(function () {
        $('.commonTab .el-tabs__content').css({
          padding: '0',
          background: '#F5F7FA',
        })
      })
    } else {
      this.$nextTick(function () {
        $('.commonTab .el-tabs__content').css({
          padding: '24px',
          background: '#fff',
        })
      })
    }
    /**
     * 工伤保险行政部门角色, 项目看板只提供看板、花名册、考勤功能，其他功能不提供
     */
    if (this.$store.state.userType === 'INS_ADMIN') {
      this.isInsuranceHidden = false
    } else {
      this.isInsuranceHidden = true
    }

    // 获取现场情况接口
    this.getLiveSituation()
    // 滁州监察端---新增拨付计划tab  获取拨付计划id
    this.getAppropriationPlanId()
    // 判断是否显示项目状态变更按钮
    this.getOauthJudge()
    this.isShowUpdate =
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListJSF:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListSGF:update') > -1
    this.isShowDetail =
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListJSF:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListSGF:detail') > -1
  },
  methods: {
    //获取小项目规则
    getMiniRule(projectId) {
      this.axios({
        method: 'post',
        url: 'api-p/project/expand/findMiniProConfig',
        data: {
          projectId,
        },
      })
        .then((res) => {
          if (!res.data.hasError) {
            this.isMini = 1
            this.miniMsg = res.data.msg ? res.data.msg : ''
            this.miniRule = res.data.result || {}
          } else {
            this.isMini = 0
          }
        })
        .catch((error) => {
          this.$message.error('查询失败')
        })
    },
    lookRule() {
      if (this.miniMsg) {
        this.$message.warning(this.miniMsg)
      } else {
        this.showRuleDialog = true
      }
    },
    goBack() {
      // this.$emit('isShow')
      // this.$router.push({
      //     path: "/home/project/projectList",
      //     name: "projectList",
      // });
      // this.$store.commit("CHANGE_SLIDER_NAME", {
      //     oldUrl: "/home/project/projectList",
      //     newUrl: this.$router.currentRoute.fullPath
      // });

      let filterField = JSON.parse(window.localStorage.getItem('filterField'))
      let pageNo = window.localStorage.getItem('pageNo')
      let pageSize = window.localStorage.getItem('pageSize')

      //返回到企业端的项目列表
      if (this.userType === 'QY' || this.userType === 'XM') {
        if (filterField != undefined && filterField != null) {
          const { projectName, areaId, status, industryId, investment, isSa } =
            filterField
          this.$router.push({
            path: '/home/project/projectListQY',
            name: 'projectListQY',
            query: {
              projectName,
              areaId,
              status,
              industryId,
              investment,
              isSa,
              pageNo,
              pageSize,
            },
          })
        } else {
          this.$router.push({
            path: '/home/project/projectListQY',
            name: 'projectListQY',
          })
        }
        this.$store.commit('GOBACK_NAME', {
          oldUrl: '/home/project/projectListQY',
          newUrl: this.$router.currentRoute.fullPath,
        })
      } else {
        //返回到监察端的项目列表
        if (this.$route.query.mark == 'label') {
          this.$router.push({
            path: '/home/labelManagement/labelManagementList',
            name: 'labelManagementList',
          })
          this.$store.commit('GOBACK_NAME', {
            oldUrl: '/home/labelManagement/labelManagementList',
            newUrl: this.$router.currentRoute.fullPath,
          })
        } else {
          if (filterField != undefined && filterField != null) {
            const {
              projectName,
              areaId,
              status,
              industryId,
              investment,
              isSa,
            } = filterField
            this.$router.push({
              path: '/home/project/projectList',
              name: 'projectList',
              query: {
                projectName,
                areaId,
                status,
                industryId,
                investment,
                isSa,
                pageNo,
                pageSize,
              },
            })
            if (
              this.$route.query.mark == 'assigned' ||
              this.$route.query.mark == 'issuesList'
            ) {
              this.$store.commit('CHANGE_SLIDER_NAME', {
                oldUrl: '/home/project/projectList',
                newUrl: this.$router.currentRoute.fullPath,
              })
            } else {
              this.$store.commit('GOBACK_NAME', {
                oldUrl: '/home/project/projectList',
                newUrl: this.$router.currentRoute.fullPath,
              })
            }
          } else {
            this.$router.push({
              path: '/home/project/projectList',
              name: 'projectList',
            })
            this.$store.commit('GOBACK_NAME', {
              oldUrl: '/home/project/projectList',
              newUrl: this.$router.currentRoute.fullPath,
            })
          }
        }
      }
    },
    //tabs栏切换
    handleClick(tab, event) {
      if (this.activeName == 'first') {
        this.$nextTick(function () {
          $('.commonTab .el-tabs__content').css({
            padding: '0',
            background: '#F5F7FA',
          })
        })
      } else {
        this.$nextTick(function () {
          $('.commonTab .el-tabs__content').css({
            padding: '24px',
            background: '#fff',
          })
        })
      }
      if (tab.label == '项目看板') {
        this.isShowFirst = true
      } else if (tab.label == '花名册') {
        this.isShowSecond = true
      } else if (tab.label == '工人考勤') {
        this.isShowThird = true
      } else if (tab.label == '工资发放') {
        this.isShowFourth = true
        this.$nextTick(function () {
          // $(".mainContent").css("padding","24px 0");
          $('.mainContent').css({ padding: '24px 0', overflow: 'none' })
        })
      } else if (tab.label == '工资专户') {
        this.isShowFifth = true
      } else if (tab.label == '班组管理') {
        this.showGroupManage = true
      } else if (tab.label == '参建单位') {
        // this.jcDetail = "jcDetail"
        this.showCompany = true
      } else if (tab.label == '项目八大员') {
        this.isShowSixth = true
      } else if (tab.label == '拨付计划') {
        this.isShowAppropriation = true
      }
    },
    getmsg(data) {
      //接收项目看板传过来的
      this.detailProjectName = data[0]
      this.detailStartDate = data[1]
      this.detailCycle = data[2]
      this.detailDisDate = data[3]
      this.detailStatus = data[4]
      this.detailsalaryDay = data[5]
      this.detailCreateTime = data[6]
      this.detailSourceType = data[7]
      this.statusDesc = data[8]
      //点击查看详情即为data[8] 也就是true
      if (data[8]) {
        this.projectDetailShow = data[8]
      }
    },
    //关闭弹框
    getCloseDia(val) {
      this.projectDetailShow = val
    },
    //获取公示牌
    getPublicSign() {
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/showpublic',
        data: {
          projectId: this.projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              //如果为true，则未上传公示牌
              this.detailIsPs = '已上传'
              var data = res.data.result
              this.imgUrl = data.absolutePath
              this.srcList.push(this.imgUrl)
            } else {
              this.detailIsPs = '未上传'
            }
          },
          (res) => {
            this.$message({
              message: '加载公示牌失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    getFileList(val) {
      this.formDataOver.oldSrcList.push(val)
      this.formDataOver.srcList.push(val)
    },
    getFile(val) {
      this.formDataOver.upLoadFile = val
    },
    changeSrcList(val) {
      this.formDataOver.srcList = val
    },
    openDialog(operateState) {
      this.butOperateState = operateState
      this.formStateVisible = true
      this.$refs.formDataOver.resetFields()
      this.formDataOver.upLoadFile = []
    },
    cancelEdit() {
      this.formStateVisible = false
      this.$refs.formDataOver.resetFields()
      this.formDataOver.upLoadFile = []
    },
    updateProjectState(newStatus, formName) {
      this.saveLoading = true
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let data = {
            projectId: this.projectId,
            status: this.detailStatus,
            newStatus: newStatus,
            operateDate: this.formDataOver.operateDate,
            remark: this.formDataOver.operateReason,
            files: JSON.stringify(this.formDataOver.upLoadFile),
          }
          this.axios({
            method: 'post',
            url: 'api-p/projectstatus/expand/createProjectStatus',
            data: data,
          })
            .then((res) => {
              if (!res.data.hasError) {
                this.$message({
                  message: res.data.msg,
                  type: 'success',
                })
                this.$nextTick(() => {
                  this.detailStatus = newStatus
                  this.formStateVisible = false
                  this.$refs.formDataFinish.resetFields()
                  this.formDataOver.upLoadFile = []
                })
              } else {
                this.$message({
                  message: res.data.erroMsg,
                  type: 'error',
                })
              }
              this.saveLoading = false
            })
            .catch((error) => {})
        } else {
          this.saveLoading = false
        }
      })
    },
    toHistoryChange() {
      this.historyChangeDia = true
    },
    //关闭历时动态弹框
    hiddenDialog() {
      this.historyChangeDia = false
    },
    //有必填项未填并且未通验证就禁用
    toDisabled() {
      if (!this.formDataOver.operateDate || !this.formDataOver.operateReason) {
        this.disabled = true
      } else {
        this.disabled = false
      }
    },
    //获取现场情况
    getLiveSituation() {
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/showPSS',
        data: {
          projectId: this.projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              //如果为true，则未上传公示牌
              this.liveSituation = '已上传'
              var data = res.data.result
              this.xcImgUrl = data.absolutePath
              this.xcSrcList.push(this.xcImgUrl)
            } else {
              this.liveSituation = '未上传'
            }
          },
          (res) => {
            this.$message({
              message: '加载项目现场情况失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    setActiveMenu(url) {
      this.$store.commit('set_active_index', url)
      this.$store.state.activeMenu = url
    },
    // 项目状态变更弹框
    statusChange() {
      this.projectStatusDia = true
    },
    statusHiddenDialog() {
      this.projectStatusDia = false
    },
    successFunc(val) {
      if (val) {
        this.detailStatus = val
      }
      this.projectStatusDia = false
    },
    getAppropriationPlanId() {
      this.axios({
        method: 'post',
        url: 'api-acc/cs/disburseaudit/expand/findProjectDisburse',
        data: {
          projectId: this.projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.disbursePlanId = res.data.msg
            } else {
              this.allocationMsg = res.data.errorMsg
            }
          },
          (res) => {
            this.$message({
              message: '获取拨付计划失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    getOauthJudge() {
      this.axios({
        method: 'post',
        url: 'api-p/cs/projectstatusauditconfig/oauthJudge',
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              // true代表有权限
              this.isShowStatuChange = res.data.result
            }
          },
          (res) => {
            this.$message({
              message: '获取数据失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
  },
}
</script>
<style scoped lang="less">
.container {
  // top: 130px;
  // padding: 0;
  .topContent {
    // position: relative;
    // background: #e4ebf1;
    height: 118px;
    padding: 20px 24px 16px;
    // border-bottom: 1px solid #E3E7E9;
    // margin: 24px 24px 0 24px;
    .greenBack {
      background-color: #009588;
      border-color: #009588;
    }
    .startTime,
    .billboard {
      margin-left: 30px;
    }
    .topProjectName {
      display: inline-block;
      // max-width: 500px;
      // font: bold 22px Microsoft YaHei;
      font-size: 22px;
      font-weight: bold;
      color: #333;
      line-height: 22px;
      .iconfanhui1 {
        font-size: 20px;
        margin-right: 6px;
        cursor: pointer;
      }
    }
    .billboard {
      font-size: 14px;
      color: #333333;
      .isUpload {
        margin-right: 6px;
      }
    }
    .alignRight {
      text-align: right;
      button {
        width: 110px;
        height: 36px;
        padding: 0;
      }
      .historyChange {
        margin-top: 10px;
        // font-size: 14px;
        // cursor: pointer;
        // color: #409eff;
        // display: inline;
        // &:hover {
        //     text-decoration:underline;
        // }
      }
      .generateQRcode {
        position: absolute;
        background: #fff;
        border-radius: 4px;
        border-radius: 4px;
        height: 126px;
        width: 93px;
        padding: 4px;
        text-align: center;
        z-index: 999;
        top: 20px;
        right: 27px;
        // margin-top: 10px;
        img {
          display: inline-block;
          width: 86px;
          height: 86px;
        }
        p {
          font-size: 12px;
          color: #666666;
          line-height: 14px;
        }
      }
      .projectLevel {
        position: absolute;
        width: 126px;
        top: 20px;
        right: 120px;
        z-index: 99;
      }
    }
    /* 开工状态 */
    .startStatus {
      padding: 0px 6px;
      background: #009588;
      color: #fff;
      font-size: 12px;
      margin-left: 10px;
      vertical-align: top;
      display: inline-block;
      // margin-top: 4px;
    }
    .startOver {
      background: #657282;
    }
    .noStart {
      background: #ffc100;
    }
    .startStop {
      background: #d9544f;
    }
    .startFinished {
      background: #0fa4c4;
    }
    .startTime {
      font-size: 14px;
      color: #666666;
      line-height: 40px;
    }
    .previewBox {
      display: inline-block;
      width: 56px;
      height: 20px;
      position: relative;
      .el-link.el-link--primary {
        vertical-align: initial;
      }
      &:hover {
        &::after {
          position: absolute;
          left: 0;
          top: 19px;
          right: 0;
          width: 100%;
          height: 0;
          border-bottom: 1px solid #409eff;
          content: '';
        }
      }
      .previewImg {
        position: absolute;
        top: 0;
        left: 0;
        cursor: pointer;
        /deep/.el-image__preview {
          opacity: 0;
        }
      }
    }
  }

  // tab栏切换
  .commonTab {
    /deep/.el-tabs__content {
      border-top: 10px solid #f5f7fa;
      padding: 0 0 0 !important;
    }
    /deep/ .el-tabs__nav-scroll {
      padding-top: 0px;
    }
  }
  .allocationPlanBox {
    .noPaymeny {
      padding-top: 140px;
      img {
        display: block;
        width: 170px;
        height: 124px;
        margin: 0 auto 15px;
      }
      p {
        line-height: 14px;
        font-size: 14px;
        color: #999;
        text-align: center;
      }
    }
  }
}
.miniStart {
  height: 20px;
  line-height: 20px;
  background-color: #fff !important;
  color: #265faa !important;
  border: 1px solid #265faa !important;
  // transform: translateY(1.5px);
  margin-right: 10px;
  vertical-align: bottom;
}
</style>
